<script setup lang="ts">
import {useRouter} from "vue-router";
import TeamcordList from "@/components/TeamcordList.vue";
import {onMounted} from "vue";
import {getTeamList} from "@/api/team.ts";
import {ref} from 'vue'
const router = useRouter();

const addTeam = () => {
    router.push('/teamAdd');
}
const teamList = ref([])
const active = ref(0);

onMounted(()=>{
  getTeamList('',active.value).then((res)=>{
    teamList.value = res.data.data

  }).catch((err)=>{})
})
const onClickTab = ({ title }) => {

    getTeamList('',active.value).then((res)=>{
      teamList.value = res.data.data

    }).catch((err)=>{})

};
</script>

<template>
  <div>
<!--    <div style="display: flex; justify-content: space-between;">-->
<!--      <van-icon name="search" size="7vw" color="#2B95EF" @click="router.push('/searchTeam')"/>-->
<!--      <IconFont name="uploader"  size="6vw" color="#2B95EF" @click="addTeam()"></IconFont>-->
<!--    </div>-->
    <van-search v-model="value" placeholder="搜索队伍"  @click="router.push('/searchTeam')"/>
    <van-tabs v-model:active="active" @click-tab="onClickTab" color="red">
      <van-tab title="公开"></van-tab>
      <van-tab title="私有"></van-tab>
      <van-tab title="私密"></van-tab>
    </van-tabs>

    <van-button  class="add-button" type="primary" icon="plus" @click="addTeam()"/>

    <!--    <van-button type="primary"">创建队伍</van-button>-->
    <TeamcordList :TeamList="teamList"></TeamcordList>
  </div>
</template>

<style scoped>

</style>